<template>
    <h2>会员等级显示页面</h2>
    等级名称<input type="text" v-model="name" />
    <input type="button" value="查询" @click="SelectData" />
    <input type="button" value="添加" @click="addRank" />
    
    <table border="1">
        <thead>
            <tr>
            <td>等级编号</td>
            <td>等级名称</td>
            <td>优惠方案</td>
            <td>消费上下限</td>
            <td>初始积分</td>
            <td>添加时间</td>
            <td>操作</td>  
        </tr>    
        </thead>
        <tbody>
            <tr v-for="item in rank">    
            <td>{{item.MR_Code}}</td>
            <td>{{item.MR_Name}}</td>
            <td>{{item.MR_Ideas}}</td>
            <td>{{item.MR_MinPrice}}-{{item.MR_MaxPrice}}</td>
            <td>{{item.MR_BeginScore}}</td>
            <td>{{ item.MR_CreateTime.substring(0,10)}}</td>
            <td>
                <input type="button" value="分配权益" @click="addRankRight(item.MR_Id)" />
            </td>  
        </tr>    
        </tbody>
    </table>
    共{{ page.count }}条数据，每页{{ page.size }}条数据,第{{ page.index }}/{{ page.pcount }}页
    <a href="#" style="margin-right: 10px;" @click="pageChange('F')">首页</a>
    <a href="#" style="margin-right: 10px;" @click="pageChange('P')">上一页</a>
    <a href="#" style="margin-right: 10px;" @click="pageChange('N')">下一页</a>
    <a href="#" style="margin-right: 10px;" @click="pageChange('E')">尾页</a>
    <select v-model="csize" @change="ChangeSize">
        <option value="1">每页1条</option>
        <option value="2">每页2条</option>
        <option value="3">每页3条</option>
    </select>
    <input type="text" v-model="nindex" style="width:30px"/>
    <input type="button" value="跳转" @click="jump"/>
</template>
<script setup lang="ts">
    import {ref,onMounted} from 'vue'
    import {useRouter} from 'vue-router'
    const router=useRouter();
    import axios from 'axios'
    import { useMemberStore } from '../../store';
    const useStore=useMemberStore();
    const addRankRight=(mrid:number)=>{
        router.push('/addRankRight');
        useStore.mrid=mrid;
    }
    const pageChange=(mes:string)=>{
        switch(mes)
        {
            case 'F':page.value.index=1;break;
            case 'P':
                if(page.value.index>1)
                {
                    page.value.index--;
                }
                else
                {
                    alert('已经是第一页了');
                }
                break;
            case 'N':
                if(page.value.index<page.value.pcount)
                {
                    page.value.index++;
                }
                else
                {
                    alert('已经是最后一页了');
                }
                break;
            case 'E':page.value.index=page.value.pcount;break;
        }
        loadData();
    }
    const csize=ref(2);
    const ChangeSize=()=>{
        page.value.size=csize.value;
        page.value.index=1;
        loadData();
    }
    const nindex=ref("");
    const jump=()=>{
        if(nindex.value=="")
        {
            alert('页码不能为空');
            return;
        }
        if(isNaN(Number(nindex.value)))
        {
            alert('请输入数字');
            return;
        }
        if(Number(nindex.value)>=1&&Number(nindex.value)<=page.value.pcount)
        {
            page.value.index=Number(nindex.value);
            loadData();
        }
        else
        {
            alert('请输入有效页码');
            return;
        }
    }
    const rank=ref([{
      "MR_Id": 1,
      "MR_Code": "",
      "MR_Name": "",
      "MR_Ideas": "",
      "MR_MinPrice": 0,
      "MR_MaxPrice": 0,
      "MR_UseMethod": "折前",
      "MR_EachScore": 1,
      "MR_Discount": null,
      "MR_BeginScore": 0,
      "MR_MinScore": 0,
      "MR_MaxScore": 0,
      "MR_CreateTime": "2024-09-05T00:00:00"
    }])
    const page=ref({
        count:0,
        pcount:0,
        index:1,
        size:2
    })
    const name=ref("");
    onMounted(()=>{
       loadData();
    })
    const loadData=()=>{
        axios.get('https://localhost:7292/api/Member/RankShow',{
            params:{
                index:page.value.index,
                size:page.value.size,
                name:name.value,
            }
        })
        .then(res=>{
            rank.value=res.data.pageList;
            page.value.count=res.data.count;
            page.value.pcount=res.data.pcount;
        })
    }
    const SelectData=()=>{
        page.value.index=1;
        loadData();
    }
    const addRank=()=>{
        router.push('/addRank');
    }
</script>